<template>
	<el-container>
		<el-header class="admin-headers">
			<div class="headers">
				<div class="logo">
					<img src="../assets/image@1x.png" alt="">
				</div>
				<div class="menus">
					<el-menu mode="horizontal">
						<el-menu-item index="1">首页</el-menu-item>
							<el-menu-item index="3">最近学习</el-menu-item>
						</el-menu>
				</div>
				<div class="users">
					<el-tag>部门</el-tag>
					<el-divider direction="vertical"></el-divider>
					<el-avatar icon="el-icon-user-solid"></el-avatar>
					<el-divider direction="vertical"></el-divider>
					<el-button type="text">超级管理员</el-button>
			</div>
			</div>
		</el-header>
	<el-main>
		<router-view></router-view>
	</el-main>
	<el-footer>
	   <div class="footer">
		   XXX版权所有 2024
	   </div>
	</el-footer>
	</el-container>
</template>

<script>
	
</script>
<style>
	.admin-headers{
		box-shadow: 0 5px 10px --5px rgba(0, 0, 0, 10%);
	}
	.headers{
		width: 1200px;
		margin:0 auto;
		display: flex;
	}
	.headers .logo{
		width: 200px;
		padding: 7px;
	}
	.headers .logo .img{
		width: 144px;
		height: 46px;
	}
	.headers .menus{
		flex:1;
	}
	.headers .users{
		display: flex;
		align-items: center;
		justify-content: flex-end;
		width: 220px;
		}
	.footer{
		width: 100%;
		height: 120px;
		text-align: center;
		line-height: 120px;
		background-color: black;
		color: #FFFFFF;
	
	}
</style>
